
var pendownflag = 0;
var selected = -1;
var dragged = -1;
var cctx = null;
var debuglevel = 8;
var eraseflag = 0;
var drawflag = 1; //checked in the radio button
var textflag = 0;
var xmax = 0;
var xmin = 0;
var ymax = 0;
var ymin = 0;
var boxes = [];
var g_ObjsJson = ""; //global string to store all drawing objects as serialized JSON
var bboxjson = "";
var currpath = [];
var wsock = null; //websocket
var freebox = 0;
var maxboxes = 20;
var owner = 0;
var viewer = 0;
var editor = 0;
var username = "";
var groupname = "";
var chatdown = 0;
var gid = 0;
var uid = 0;

var settings = {
  'bgColor': '#fff',
  'borderWidth': 1,
  'lineWidth': 3,
  'eraseWidth': 20,
  'width' : 640,
  'height' : 400,
  'gridsize' : 20,
  'strokeStyle': '#5DB5D5',
  'boxmode': 0,
  'pathmode': 1,
  'autosave': 0,
  'grid': 0,
  'demo': 0
};


$(function() {
  var i = 0;

  LB.Canvas.initCanvas();
  LB.UI.initUI();

  for(i=0; i<maxboxes; i++) {
    var b = new BBox();
    b.id = i;
    b.next = i+1;
    boxes.push(b);
  }

  //LB.UI.message("test message", 500);
  //LB.UI.confirm("test message", function(){alert("test msg");});

  //enable login dialog
  $( "#logindialog" ).dialog( {
        autoOpen: false, 
        buttons: 
            {
              "Ok": function() { $(this).dialog("close"); }
            }
  });

  syncInit();

  $(".ui-dialog-titlebar-close").hide();
  $(".ui-dialog-titlebar").hide();

  var demo = LB.Utils.getRequestParam('demo');
  if(demo) {
    settings.demo = 1;
    settings.autosave = 0;
    $("#hdrlogo").html("<b>liveBoard Demo</b>");
  }


  var join = LB.Utils.getRequestParam('gid');
  if(join) {
    gid = join;
    $("#share_btn").bind('vclick', showJoin);
    $("#share_btn").attr("href", "#joindialog_jqm");
    $("#share_btn span:first").text("Join");
    showJoin();
  }
  else {
    //$("#join_btn").hide();
    $("#share_btn").bind('vclick', showShare);
  }

  //get the gid before initializing the DB
  dbInit(gid);

  if(settings.autosave === 1) {
    setInterval(LB.Canvas.save, 10000);
  }

  LB.Canvas.redrawCanvas();

});


function changeSettings(color, size, opaq) {
  if(color !== "") {
    settings.strokeStyle = color;
  }
  if(size !== 0) {
    settings.lineWidth = size;
  }
}


//for creator this will give a freebox from the 
//boxes list.
function get_bbox() {
  var i = freebox;
  freebox = boxes[freebox].next;
  if(freebox > maxboxes) {
    writeDebug("get_bbox: you ran out bboxes remove some drawings, freebox=" + freebox, 3);
    alert("ran out of bbox");
  }
  writeDebug("get_bbox: free=" + freebox + " i=" + i, 3);
  boxes[i].removed = 0;
  boxes[i].inuse = 1;
  return boxes[i];
}


function free_bbox(i) {
  boxes[i].reset();;
  boxes[i].next = freebox;
  freebox = i;
}


function writeDebug(message, level) {
    if(debuglevel >= level) {
      //$("#debugoutput").append(message + '<br>');
      console.log(message);
    }
}


function chat() {
  writeDebug("show chat", 5);
  $("#debugarea").hide();
  $("#skypearea").hide();
  $("#chatarea").slideToggle('slow');
  if(chatdown === 1) {
    chatdown = 0;
  }
  else {
    chatdown = 1;
  }
  $("#commarea").effect("highlight", {}, 300, function(){});
  $('#chatoutput').attr('scrollTop', $('#chatoutput').attr('scrollHeight'));
}


function skype() {
  $("#chatarea").hide();
  $("#skypearea").slideToggle('slow');
  $("#commarea").effect("highlight", {}, 300, function(){});
}


function chat_send() {
  var str = $("#chat_input").val();
  var msg = "";
  if(str === "") {
    return;
  }

  msg = User.userName + ': ' + str + '<br>';
  $("#chatoutput").append(msg);
  $("#chat_input").val("");
  $('#chatoutput').attr('scrollTop', $('#chatoutput').attr('scrollHeight'));

  var info = {
    'message': msg
  }
  if(wsock) {
    wsock.send2('chat', '', info);
  }
}


function debug() {
  writeDebug("show debug", 5);
  $("#chatarea").hide();
  $("#debugarea").slideToggle('slow');
}


function erase() {
  writeDebug("setting eraser", 5);
  if(eraseflag === 0) {
    eraseflag = 1;
  }
  else if(eraseflag === 1) {
    eraseflag = 0;
  }
}


function setting_btn() {
  $("#settingpanel").toggle('fade');
  /*
    $("#canvasarea").animate(
            {"left": "-=300px"}, "slow");
    $("#settings_page").animate(
            {"left": "-=300px"}, "slow");
    this.flag = 0;
  */
  
}


function sendSettings() {
  var data = {
    'type': 'settings',
    'settings': settings
  }
  if(wsock) {
    wsock.send(JSON.stringify(data));
  }
}
